<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/02.fangdajing.css">
</head>

<body>
    <!-- header -->
    <div class="header">
        <div class="headercenter">
            <div class="h_left">
                <img src="./img/1.png" alt="">
            </div>
            <div class="h_center">
                <input type="text" placeholder="漫步者">
            </div>
            <div class="sousuo">
                <ul>
                    <!-- <li>1</li>-->
                </ul>
            </div>
            <div class="h_right_1">
                <img src="./img/2.png" alt="">
            </div>
            <div class="h_right_2">
                <p>登录</p>
                <div class="h_right_1_1">
                    <ul>
                        <li>手机号登陆</li>
                        <li>微信登录</li>
                        <li>QQ登录</li>
                        <li>新浪微博登录</li>
                        <li>网易邮箱账号登录</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

    <div class="kongbai"></div>

    <div class="content">
        <!-- 结构布局 -->
        <div class="box" id="enalrge">
            <!-- 展示图片盒子 -->
            <div class="show">
                <img src="" alt="">
                <!-- 遮罩层盒子 -->
                <div class="mask"></div>
            </div>

            <!-- 切换列表盒子 -->
            <div class="list">
                <p class="active">
                    <img src="" alt="">
                </p>
                <p>
                    <img src="" alt="">
                </p>
            </div>

            <!-- 放大镜盒子 -->
            <div class="enlarge"></div>
        </div>

        <div class="contright">
            <p class="p1">i12真无线蓝牙耳机 智能触控 双耳运动跑步 安卓苹果通用
            </p>
            <p>【买即赠硅胶套+登山扣】记忆配对；双耳通话；原声音质；20小时持久续航
            </p>
            <p class="p2">￥49 <a href="">199</a>
            </p>
            <div class="p3">
                <div class="p3_1">颜色：</div>
                <div class="p3_2">白色</div>
            </div>
            <div class="p4">
                <div class="p4_1">
                    <div class="p4_1_0">数量：</div>   
                    <div class="p4_1_1">-</div>
                    <div class="p4_1_2">1</div>
                    <div class="p4_1_3">+</div>
                </div>
            </div>
            <p>服务：
                <a>15天无忧换货</a>
                <a>满119包邮</a>
                <a>商家发货</a>
                <a>网易自营</a>
            </p>
            <div class="p6">
                <div class="p6_1">立即购买</div>
                <div class="p6_2">加入购物车</div>
            </div>
            <div>
                <a href="./00.shouye.html">返回首页</a>
            </div>
        </div>
    </div>

    <div class="footer">
        <div class="footercenter">
            <div class="f_left">
                <p>
                    <a href="">服务条款</a>
                    <a href="">隐私政策</a>
                    <a href="">儿童隐私政策</a>
                    <a href="">版权投诉指引</a>
                    <a href="">意见反馈</a>
                </p>
                <p>网易公司版权所有&copy;1997-2021杭州乐读科技有限公司运营:浙网文[2021] 1186-054号</p>

                <p>违法和不良信息举报电话:0571-89853516举报邮箱: ncm5990@163.com</p>
                <p>食品经营许可证出版物经营许可证营业执照网络食品交易第三方平台提供者信息备案:浙网食A33010041进口冷链管理承诺书</p>
                <p>粤B2-20090191-18举报邮箱:工业和信息化部备案管理系统网站</p>
            </div>
            <div class="f_right">
                <img src="./img/9.png" alt="">
            </div>
        </div>
    </div>
    <script src="./js/02.fangdajing.js"></script>
    <script>
        const e = new Enlarge('#enalrge')
        console.log(e)
    </script>
</body>

</html>